<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button>点击我停止定时器</button>
    <script>
        //一、 定时器使用  setInterval 定时执行某一段代码（回调函数里的代码）;
        // 时间是毫秒
        // setInterval会在后台运行 消耗性能；
        //    var timer =   setInterval(() => {
        //         console.log('setInterval');
        //     }, 1000);
        //     // 清除定时器
        //     var ele = document.getElementsByTagName("button")[0];
        //     ele.onclick = function(){
        //         clearInterval(timer);
        //     }

        //二、 后台运行性能
        // var num = 0;
        // setInterval(() => {
        //     document.title = num;
        //     num++;
        // }, 1000);
        // 三、定时器应用（动画）;


        // setTimeout 指定时间执行一次回调里的代码，单位也是毫秒

        // var timer = setTimeout(() => {
        //     console.log("定时执行");
        // }, 3000);
        // // 清除定时器
        // var ele = document.getElementsByTagName("button")[0];
        // ele.onclick = function () {
        //     clearTimeout(timer);
        // }
        // 递归
            // function fn(){
            //     console.log("fn");
            //     setTimeout(() => { 
            //         fn();
            //     }, 1000);
            // }
            // fn();
            
            // setTimeout 还是 setInterval 他们的代码执行顺序一定是在 script 代码执行之后

            // setTimeout(() => {
            //     console.log("setTimeout")
            // },0);
            // console.log(123);
           


    </script>
</body>

</html>